<!-- 表单弹窗 -->
<form id="category-form" lay-filter="category-form" class="layui-form model-form">
    <input name="cateid" type="hidden"/>
    <input name="userid" type="hidden"/>
    <div class="layui-form-item">
        <label class="layui-form-label">专栏名称</label>
        <div class="layui-input-block">
            <input name="caname" placeholder="请输入分类专栏名称" type="text" class="layui-input"
                   lay-verify="required" required/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">专栏简介</label>
        <div class="layui-input-block">
            <textarea name="cainfo" placeholder="请输入分类专栏简介" type="text" class="layui-textarea"></textarea>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">专栏配图</label>
        <div class=" layui-input-block layui-upload">
            <button type="button" class="layui-btn" id="upload_btn">上传图片</button>
            <div class="layui-upload-list">
                <img class="layui-upload-img" id="showImg"/>
                <p id="backText"></p>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">排序号</label>
        <div class="layui-input-block">
            <input name="casort" placeholder="请输入排序号" type="number" class="layui-input"/>
        </div>
    </div>
    <div class="layui-form-item model-form-footer">
        <button class="layui-btn layui-btn-primary" ew-event="closePopup"  type="button">取消</button>
        <button class="layui-btn" lay-filter="category-form-submit" lay-submit>保存</button>
    </div>
</form>

<script>
    layui.use(['layer', 'admin', 'form', 'laydate', 'config', 'jquery'], function () {
        let layer = layui.layer,
            admin = layui.admin,
            form = layui.form,
            config = layui.config,
            laydate = layui.laydate,
            $ = layui.jquery;
        //开启公历节日
        laydate.render({
            elem: '#endtim'
            , calendar: true
            , trigger: 'click'
            , type: 'datetime'
        });

        // 填充表单数据
        let category = admin.getTempData('t_category');
        if (category) {
            form.val('category-form', category);
            $('#showImg').attr('src', category.banner);
            form.render();
        }
        admin.layuiUpload("#upload_btn", "api-file/files-anon");
        // 表单提交事件
        form.on('submit(category-form-submit)', function (data) {
            layer.load(2);
            let banner = $('#showImg');
            let params = data.field;
            params.userid = config.getUser().id;
            params.banner = banner.attr('url') ? banner.attr('url') : banner.attr('src');
            admin.req('api-forum/article/category/saveOrUpdate', JSON.stringify(params), function (data) {
                layer.closeAll('loading');
                if (data.code === 0) {
                    layer.msg(data.msg, {icon: 1, time: 500});
                    admin.finishPopupCenter();
                } else {
                    layer.msg(data.msg, {icon: 2, time: 500});
                }
            }, 'POST');
            return false;
        });
    });
</script>
